<template>
  <div class="list_article_hot">
    <!-- 热门文章组件 -->
    <div class="article_hot_block">
      <router-link
        :to="'/article/details?article_id=' + o[vm.article_id]"
        v-for="(o, i) in list"
        :key="i"
        class="item_hot"
      >
        <div class="title_wrap ellipsis_1">
          {{ o[vm.title] }}
        </div>
      </router-link>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
      default: function () {
        return [];
      },
    },
    vm: {
      type: Object,
      default: function () {
        return {
          img: "img",
          article_id: "article_id",
          title: "title",
          description: "description",
          title: "title",
          create_time: "create_time",
          content: "content",
          praise_len: "praise_len",
          hits: "hits",
        };
      },
    },
  },
  methods: {},
};
</script>

<style scoped>
.list_article_hot {
  width: 100%;
}
.article_hot_block {
  display: block;
  margin-top: 18px;
}
.item_hot::before {
  content: "●";
  padding-right: 15px;
}
.item_hot {
  display: flex;
  width: 100%;
  padding-top: 20px;
}
.title_wrap {
  font-size: 15px;
  font-weight: bold;
}
.ellipsis_1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
</style>